【CSS】max-width - 横幅（最大値）

CSSのmax-widthプロパティについて解説します。

検証環境

CSS

macOS

14.1

max-width

max-widthは“横幅の最大値”のプロパティです。

標準ではコンテンツボックスの最大横幅になります。

※ box-sizingプロパティを設定した場合、最大横幅の対象はその値に従います。

基本構文

max-width: 値;

サンプル

sample.html

<style>
img {
    width: 100%;
    ___ih_hl_start
    max-width: 200px;
    ___ih_hl_end
}
</style>
 
<img src="https://it-hack.net/storage/app/media/document/development/programming/css/properties/max-width/hacker-commandline.jpeg">

プレビュー